<template>
  <div class="app-container">
    <basic-container>
      <avue-crud ref="crud"
                 v-model="vipLevelForm"
                 :page="vipLevelPage"
                 :data="tableData"
                 :option="tableOption"
                 :table-loading="vipLevelLoading"
                 @on-load="getList"
                 @refresh-change="refreshChange"
                 @row-update="rowUpdate"
                 @row-save="rowSave"
                 @row-del="rowDel">
        <template slot-scope="scope"
                  slot="menuLeft">
          <router-link :to="{path:`/vipLevel/add`}">
            <el-button icon="el-icon-plus"
                       size="small"
                       type="primary">新增</el-button>
          </router-link>
        </template>
        <template slot-scope="scope"
                  slot="menu">
          <el-button @click="rowEdit(scope.row)"
                     icon="el-icon-edit"
                     size="small"
                     type="primary">编辑</el-button>
          <el-button @click="rowDel(scope.row)"
                     icon="el-icon-delete"
                     size="small"
                     type="danger">删除</el-button>
        </template>
        <template slot-scope="scope"
                  slot="flag">
          <el-tag v-if="Number(scope.row.flag)===0"
                  type="success">{{scope.label}}</el-tag>
          <el-tag v-else-if="Number(scope.row.flag)===1"
                  type="warning">{{scope.label}}</el-tag>
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import { fetchList, addObj, putObj, delObj } from "@/api/vipManage/vipLevel";
export default {
  name: "crud",
  data() {
    return {
      vipLevelForm: {},
      vipLevelLoading: false,
      vipLevelPage: {
        total: 0,
        currentPage: 1,
        pageSize: 10,
        orderBy: `order by id asc`
      },
      tableOption: {
        index: true,
        border: true,
        stripe: true,
        addBtn: false,
        editBtn: false,
        delBtn: false,
        selection: true,
        maxHeight: 400,
        menuWidth: 280,
        menu: true,
        indexLabel: "序号",
        align: "center",
        column: [
          {
            label: "编号",
            size: "small",
            prop: "code"
          },
          {
            label: "排序",
            size: "small",
            prop: "cz"
          },
          {
            label: "会员等级",
            size: "small",
            prop: "vipdj"
          },
          {
            label: "条件",
            size: "small",
            prop: "tj"
          },
          {
            label: "折扣",
            size: "small",
            prop: "zhekou"
          },
          {
            label: "状态",
            size: "small",
            type: "select",
            prop: "flag",
            solt: true,
            dicData: [
              {
                label: "是",
                value: "0"
              },
              {
                label: "否",
                value: "1"
              }
            ]
          }
        ]
      },
      tableData: []
    };
  },
  created() {},
  mounted: function() {},
  methods: {
    getList(page) {
      this.vipLevelLoading = true;
      fetchList({
        start: (page.currentPage - 1) * page.pageSize,
        length: page.pageSize,
        orderBy: this.vipLevelPage.orderBy
      }).then(res => {
        this.vipLevelLoading = false;
        this.vipLevelPage.total = res.data.recordsTotal;
        this.tableData = res.data.data;
      });
    },
    refreshChange() {
      this.getList(this.vipLevelPage);
      this.$message({
        showClose: true,
        message: "刷新成功",
        type: "success"
      });
    },
    rowDel(row) {
      this.$confirm("是否确认删除", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return delObj(row.id);
        })
        .then(() => {
          this.$message({
            showClose: true,
            message: "删除成功",
            type: "success"
          });
          this.getList(this.vipLevelPage);
        })
        .catch(function() {});
    },
    rowUpdate(row, index, done) {
      putObj(row).then(() => {
        this.$message({
          showClose: true,
          message: "修改成功",
          type: "success"
        });
        this.getList(this.vipLevelPage);
        done();
      });
    },
    rowSave(row, done) {
      addObj(Object.assign({}, row)).then(() => {
        this.$message({
          showClose: true,
          message: "添加成功",
          type: "success"
        });
        this.getList(this.vipLevelPage);
        done();
      });
    },
    rowEdit(row) {
      this.$router.push({
        path: `/vipLevel/edit/${row.id}`
      });
    }
  }
};
</script>

